<!-- 二维码管理标签页 -->
<div class="tab-content" id="qrcodeTab">
    <div class="toolbar">
        <h2>📱 设备二维码生成与管理</h2>
    </div>

    <div style="background:#e6f7ff;padding:15px;border-radius:8px;margin-bottom:30px;border-left:4px solid #1677ff;">
        <strong>💡 功能说明：</strong> 为设备生成专属二维码，扫码后直接跳转到对应设备的报修页面并自动填充设备信息。
    </div>

    <!-- 单个生成 -->
    <div style="background:#f9f9f9;padding:25px;border-radius:12px;margin-bottom:30px;">
        <h3 style="margin-bottom:20px;color:#333;"><span style="color:#1677ff;">🔧</span> 单个设备二维码生成</h3>

        <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;">
            <div class="form-group">
                <label>资产ID</label>
                <input type="number" id="singleAssetId" placeholder="例如: 1"
                    style="width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:6px;">
                <p style="font-size:12px;color:#666;margin-top:5px;">请输入要生成二维码的设备资产ID（不是资产编号）</p>
            </div>

            <div class="form-group">
                <label>小程序域名</label>
                <input type="text" id="qrDomain" value="https://你的域名"
                    style="width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:6px;">
                <p style="font-size:12px;color:#666;margin-top:5px;">您配置的微信小程序业务域名</p>
            </div>
        </div>

        <button class="btn btn-primary" onclick="generateSingleQR()" style="padding:12px 30px;font-size:16px;">
            ✨ 生成二维码URL
        </button>

        <!-- 生成结果 -->
        <div id="singleQRResult"
            style="display:none;margin-top:25px;padding:20px;background:white;border-radius:8px;border:2px solid #52c41a;">
            <h4 style="color:#52c41a;margin-bottom:15px;">✅ 生成成功</h4>
            <div style="margin-bottom:10px;">
                <strong>资产ID:</strong> <span id="resultSingleAssetId"></span>
            </div>
            <div style="margin-bottom:15px;">
                <strong>二维码URL:</strong>
                <div style="background:#f5f5f5;padding:10px;border-radius:4px;margin-top:5px;word-break:break-all;font-family:monospace;font-size:13px;"
                    id="resultSingleURL"></div>
            </div>
            <p style="color:#666;font-size:13px;">💡 将此URL粘贴到在线二维码生成工具（如 <a href="https://cli.im/" target="_blank"
                    style="color:#1677ff;">草料二维码</a>）生成二维码图片并打印。</p>
        </div>
    </div>

    <!-- 批量生成 -->
    <div style="background:#f9f9f9;padding:25px;border-radius:12px;margin-bottom:30px;">
        <h3 style="margin-bottom:20px;color:#333;"><span style="color:#1677ff;">📋</span> 批量生成二维码</h3>

        <div style="display:grid;grid-template-columns:2fr 1fr;gap:20px;margin-bottom:20px;">
            <div class="form-group">
                <label>资产ID列表（每行一个）</label>
                <textarea id="batchAssetIds" rows="5" placeholder="1&#10;3&#10;4"
                    style="width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:6px;font-family:monospace;"></textarea>
                <p style="font-size:12px;color:#666;margin-top:5px;">每行输入一个资产ID</p>
            </div>

            <div>
                <div class="form-group">
                    <label>快速填充</label>
                    <button class="btn btn-success" onclick="fillUnassignedAssets()"
                        style="width:100%;margin-bottom:10px;">
                        🔍 填充未配置二维码的设备
                    </button>
                    <button class="btn btn-warning" onclick="fillAllAssets()" style="width:100%;">
                        📦 填充所有设备
                    </button>
                </div>
            </div>
        </div>

        <button class="btn btn-primary" onclick="generateBatchQR()" style="padding:12px 30px;font-size:16px;">
            ✨ 批量生成
        </button>

        <!-- 批量生成结果 -->
        <div id="batchQRResult" style="margin-top:25px;"></div>
    </div>

    <!-- 已生成的二维码列表 -->
    <div style="background:white;padding:25px;border-radius:12px;">
        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;">
            <h3 style="color:#333;margin:0;"><span style="color:#52c41a;">✅</span> 已生成二维码的设备</h3>
            <button class="btn btn-success" onclick="loadQRCodeList()">🔄 刷新列表</button>
        </div>

        <table>
            <thead>
                <tr>
                    <th>资产ID</th>
                    <th>资产编号</th>
                    <th>设备名称</th>
                    <th>机房</th>
                    <th>二维码URL</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="qrCodeList">
                <tr>
                    <td colspan="7" class="empty-state">
                        <div class="empty-icon">📭</div>
                        <div>点击刷新列表加载数据</div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>